<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
        <link rel="stylesheet" href="${pageContext.request.contextPath}/css/aboutme.css">
        <script src="${pageContext.request.contextPath}/js/aboutme.js"></script>
        <script>
            var flag = '${flag}'
            if (flag == '1') {
                alert('用户名存在');
            } else if (flag == '2') {
                alert('原密码输入错误');
            }
        </script>
        <div class="aboutme">
            <h1>关于我</h1>
            <table class="me" id="${gengraluser.id}">
                <tr>
                    <th>姓名</th>
                    <th>${nowloginuser.name}</th>
                </tr>
                <tr>
                    <th>性别</th>
                    <th>${nowloginuser.sex eq 0?'男':'女'}</th>
                </tr>
                <tr>
                    <th>年龄</th>
                    <th>${nowloginuser.age}</th>
                </tr>
                <tr>
                    <th>用户名</th>
                    <th id="1">${nowloginuser.username}<img src="${pageContext.request.contextPath}/images/modify.png"
                            alt="修改用户名" class="changeusr"> </th>
                </tr>
                <tr>
                    <th>密码</th>
                    <th id="2">********<img src="${pageContext.request.contextPath}/images/modify.png" alt="修改密码"
                            class="changepwd"></th>
                </tr>
                <tr>
                    <th>邮箱</th>
                    <th>${nowloginuser.email}</th>
                </tr>
            </table>
            <h2>我的游戏</h2>
            <table class="mygame">
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>游戏名</th>
                        <th>发行商</th>
                        <th>发行日期</th>
                        <th>简介</th>
                        <th>游戏类型</th>
                        <th>购买日期</th>
                    </tr>
                </thead>
                <tbody>
                    <c:forEach items="${mygames}" var="mygame" varStatus="stat">
                        <tr>
                            <td>${stat.index+1+page}</td>
                            <td>${mygame.gamename}</td>
                            <td>${mygame.publisher}</td>
                            <td>${mygame.adddate}</td>
                            <td>${mygame.introduce}</td>
                            <td>${mygame.type}</td>
                            <td>${mygame.buydate}</td>
                        </tr>
                    </c:forEach>
                </tbody>
            </table>
            <div class="page">
                <input type="button" value="首页" class="start_page"> <input type="button" value="上一页" class="prev_page">
                <input type="button" value="下一页" class="next_page"> <input type="button" value="尾页" class="end_page">
            </div>
            <script>
                //页面跳转
                var page = parseInt('${page}');
                var total = parseInt('${totalPage}');
                var up = $('.aboutme .page .prev_page');
                var down = $('.aboutme .page .next_page');
                var start = $('.aboutme .page .start_page')
                var end = $('.aboutme .page .end_page');
                up.click(function () {
                    page = page - 8;
                    if (page < 0) {
                        page = 0;
                    } else {
                        window.location.href = 'aboutme?page=' + page;
                    }
                });

                down.click(function () {
                    page = page + 8;
                    if (page > total * 8 - 8) {
                        page = total * 8 - 8;
                    } else {
                        window.location.href = 'aboutme?page=' + page;
                    }
                });

                start.click(function () {
                    page = page = 0;
                    window.location.href = 'aboutme?page=' + page;
                })

                end.click(function () {
                    page = page = total * 8 - 8;
                    window.location.href = 'aboutme?page=' + page;
                });
            </script>

            <!-- 隐藏弹出层 -->
            <div class="hidden">
                <div class="cusr_page">
                    <span>修改用户名</span> <input type="text" placeholder="请输入新用户名..." class="usr_text">
                    <h3></h3>
                    <input type="button" value="确定" class="determine"> <input type="button" value="取消" class="cancel">
                </div>
                <div class="cpwd_page">
                    <span>修改密码</span> <input type="password" placeholder="请输入原密码..." class="oldpwd_text"> <input
                        type="password" placeholder="请输入新密码..." class="pwd_text"> <input type="password"
                        placeholder="再次输入密码..." class="repwd_text">
                    <h3></h3>
                    <input type="button" value="确定" class="determine"> <input type="button" value="取消" class="cancel">
                </div>
            </div>
        </div>